<template>
	<view>
		<u-input :value="date" :placeholder="placeholder" @click="showPicker = true" :selectOpen="showPicker" type="select" inputAlign="right"></u-input>
		<u-picker
			:default-time="date"
			@confirm="onPickerChange"
			v-model="showPicker"
			mode="time"
			:params="{ year: true, month: true, day: true }"
		></u-picker>
	</view>
</template>

<script>
export default {
	name: 'date-picker',
	props: {
		placeholder: {
			type: String,
			default: '请选择日期'
		},
		value: {
			type: [String, Number],
			default: null
		},
	},
	data() {
		return {
			showPicker: false,
			date: null,
		};
	},
	
	created() {
		if(this.value) {
			if(typeof(this.value) == 'string') {
				this.date = this.value;
			}else {
				this.date = this.$u.date(this.value);
			}
		}else {
			this.date = this.$u.date(new Date());
		}
	},
	
	methods: {
		onPickerChange(e) {
			this.date = `${e.year}-${e.month}-${e.day}`;
			this.$emit('input', parseInt(new Date(this.date).getTime() / 1000))
		}
	},
	
	
};
</script>

<style lang="scss"></style>
